<template>
  <transition name="el-zoom-in-center">
    <el-row v-show="show">
      <el-col>
        <login/>
      </el-col>
    </el-row>
  </transition>
</template>
<script type="es6">
  const login = () =>
    import ('@/components/login/Login')
  export default {
    components: {
      "login": login
    },
    data() {
      return {
        show:false
      }
    },
    beforeMount(){
      this.proAPI.getJson(this.proAPI.URLS.getAllSysConfig).then((res) =>{
        this.$store.commit("saveConfig",res.data);
        var el = document.getElementById("app");
        el.style.height=window.document.body.offsetHeight+"px";
        el.style.minHeight=window.document.body.offsetHeight+"px";
        el.style.width=window.document.body.offsetWidth+"px";
        el.style.minWidth=window.document.body.offsetWidth+"px";
        el.style.backgroundImage = 'url("'+this.proAPI.RESOURCE_URL+this.$store.getters.getConfig().clientBgImagePC+'")';
        el.style.backgroundSize = 'cover';
      })
    },
    mounted(){
      this.show = true;
    },
  }
</script>
<style scoped>
  #app{
    background: rgb(105,155,200);
    background: -moz-radial-gradient(top left, ellipse cover, rgba(105,155,200,1) 0%, rgba(43,197,216,1) 57%);
    background: -webkit-gradient(radial, top left, 0px, top left, 100%, color-stop(0%,rgba(105,155,200,1)), color-stop(57%,rgba(43,197,216,1)));
    background: -webkit-radial-gradient(top left, ellipse cover, rgba(105,155,200,1) 0%,rgba(43,197,216,1) 57%);
    background: -o-radial-gradient(top left, ellipse cover, rgba(105,155,200,1) 0%,rgba(43,197,216,1) 57%);
    background: -ms-radial-gradient(top left, ellipse cover, rgba(105,155,200,1) 0%,rgba(43,197,216,1) 57%);
    background: radial-gradient(ellipse at top left, rgba(105,155,200,1) 0%,rgba(43,197,216,1) 57%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#699bc8', endColorstr='#b5c5d8',GradientType=1 );
  }
</style>
